<template>
  <div>
    <el-pagination
      class="mg-top-20"
      background
      layout="prev, pager, next"
      :total="data.total"
      :current-page="data.current_page"
      :page-size="data.per_page"
      @current-change="changePage"
    />
  </div>
</template>

<script>
export default {
  name: 'MyPage',
  emits: ['change'],
  props: {
    // eslint-disable-next-line vue/require-default-prop
    data: Object,
    // eslint-disable-next-line vue/require-default-prop,vue/require-prop-types
    default: () => ({
      total: 0,
      current_page: 0,
      per_page: 0
    })
  },
  methods: {
    changePage(page) {
      console.log(page)
      this.$emit('change', page)
    }
  }
}
</script>

<style scoped>

</style>
